<template>
  <div class="edtior-container">
      <div class="editor-header">
        <Header />
      </div>
    <div>
      <div class="container">
        <Left />
        <Right />
      </div>
      <Center />

    </div>
  </div>
</template>

<script setup lang="ts">
import Header from '@/components/Common/Header.vue'
import Center from './Center.vue'
import Right from './Right.vue'
import Left from './Left/index.vue'
</script>

<style scoped lang="scss">
.editor-header {
  width: 100%;
  background-color: var(--white);
  position: fixed;
  top: 0;
  z-index: 10;
}
.container {
  width: calc(100vw - 40px);
  padding: 20px;
  // Header的高度50px，上下padding 20px
  height: calc(100vh - 50px - 40px);
  background: url('@/assets/imgs/editor_background.png');
  position: fixed;
  top: 50px;
}
</style>
